<!DOCTYPE html>
<html>


	<head>
		<meta name="viewport" content="width=device-width" />
<meta charset="UTF-8"/>
		<link rel="stylesheet" href="static/css/pad.css" />
		<script src="static/script/bt_proto.js"></script>
		<script src="static/script/jquery-2.0.3.min.js"></script>
		<script src="static/script/jquery-ui.min.js"></script>
		<link rel="stylesheet" href="static/css/layout-default-latest.css" />
		<script src="static/script/layout_and_pugins.js"></script>
		<link rel="stylesheet" href="static/css/bootstrap.min.css">
		<script src="static/script/bootstrap.min.js"></script>
		<link href="static/css/style.min.css" rel="stylesheet">
		<script src="static/script/jstree.min.js"></script>
		<link href="static/css/bootstrap-multiselect.css" rel="stylesheet">
		<script src="static/script/bootstrap-multiselect.min.js"></script>
		<link href="static/css/bootstrap-table.min.css" rel="stylesheet">
		<script src="static/script/bootstrap-table.min.js"></script>
		<script src="static/script/bootstrap-table-zh-CN.min.js"></script>
		<link rel="stylesheet" href="static/css/fuelux.min.css">
		<!-- codemirror -->
		<link rel="stylesheet" href="static/css/codemirror.css">
		<link rel="stylesheet" href="static/css/show-hint.css">
		<script src="static/script/codemirror.js" type="text/javascript" charset="utf-8"></script>
		<script src="static/script/python.js" type="text/javascript" charset="utf-8"></script>
		<script src="static/script/clike.js" type="text/javascript" charset="utf-8"></script>
		<script src="static/script/show-hint.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" href="static/css/bootstrap-select.min.css">
		<script src="static/script/bootstrap-select.min.js"></script>

		<!--时间控件-->
		<script src="static/script/moment.js"></script>
		<link href="static/css/bootstrap-datetimepicker.min.css" rel="stylesheet">
		<link href="static/css/bootstrap-datetimepicker-standalone.min.css"
		 rel="stylesheet">
		<script src="static/script/bootstrap-datetimepicker.min.js"></script>
		<script src="static/script/bootstrap-datetimepicker.zh-CN.js"></script>
		<!-- quant web css-->
		<link rel="stylesheet" href="static/css/main.css">

	</head>
	<body class="fuelux">

		<!-- NORTH -->
		<div id="north" class="ui-layout-north">

			<nav class="navbar navbar-default" style="margin-bottom: 0; height: 35px; ">
				<div class="container-fluid">
					<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
						<ul class="nav navbar-nav disable-select" style="margin-left: -30px">
							<li><img src="http://www.syzcfund.com/img/logo.jpg" width="41" height="40" alt="商羊资产" style="margin-top: 4px; margin-left: 15px; margin-right: 5px" /></li>
							<li class="dropdown" id="mnuFile">
								<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"
								 style="margin-top: -1px">文件 <span class="caret"></span></a>
								<ul class="dropdown-menu">
									<li class="">
										<a href="#" onclick="showCreateStrategyDialog();">新建策略</a>
									</li>
									<li role="separator" class="divider"></li>
									<li class="">
										<a href="#" onclick="showSchemaCreateDialog();">新建回测配置</a>
									</li>
									<li role="separator" class="divider"></li>

								</ul>
							</li>
							<!-- <li id="stop-project" style="margin-top: -1px; margin-left: 12px">
								<a href="#" onclick="startProcess();">运行</a>
							</li> -->


						</ul>
						<ul class="nav navbar-nav navbar-right" style="margin-right:-25px">
							<li class="disable-select">
								<a href="javascript:fresh()">退出</a>
							</li>
						</ul>
					</div>
				</div>
			</nav>
		</div>
		<!-- WEST -->
		<div id="west" class="ui-layout-west" style="padding: 0px 0px 0px 10px; overflow-y: hidden">
			<div style="height: 90%; margin:0; padding:0">
				<!-- tabs -->
				<ul class="nav nav-tabs" role="tablist" id="tabs">
					<li role="presentation" class="active" id="tabHeaderSolutionExplorer">
						<a href="#solutionexplorer" aria-controls="solutionexplorer" role="tab" data-toggle="tab" id="current-strategy">当前项目</a>
					</li>
					<li role="presentation">
						<a href="#instruments" aria-controls="instruments" role="tab" data-toggle="tab">场景</a>
					</li>
				</ul>

				<!-- pages -->
				<div class="panel panel-default" id="left-pages" style="width: 100%; height: 100%; margin-top: -1px">
					<div class="tab-content">
						<!-- solution explorer page -->
						<div role="tabpanel" class="tab-pane active" id="solutionexplorer">

							<div class="tree " style="border: 0px; font-size: 14px; max-height: 526px; overflow-y: auto;">

								<div id="treeStrategy" class="ztree"></div>
							</div>

						</div>

						<!-- instruments page -->
						<div role="tabpanel" class="tab-pane" id="instruments">
							<div class="tree " style="border: 0px; font-size: 14px; max-height: 526px; overflow-y: auto;">

								<div id="treeSchema" class="ztree"></div>
							</div>

						</div>

					</div>
				</div>
			</div>
		</div>

		<!-- EAST -->

		<div class="ui-layout-east" style="padding: 0px 10px 0px 0px; overflow-y: hidden">
			<div style="height: 90%; margin: 0; padding: 0">

				<!-- tabs -->

				<ul class="nav nav-tabs" role="tablist" id="right-tabs">
					<li role="presentation" class="active">
						<a href="#logs" aria-controls="logs" role="tab" data-toggle="tab">回测报告</a>
					</li>
				</ul>

				<!-- pages -->
				<div class="panel panel-default" id="right-pages" style="width: 100%; height: 100%; margin-top: -1px">
					<div class="tab-content">
						<!-- logs -->
						<div role="tabpanel" class="tab-pane active">
							<div class="panel-body" style="height: 100%;" id="logs">
							</div>
						</div>
						<!-- properties page -->
						<div role="tabpanel" class="tab-pane" id="properties" style="padding: 14px; padding-top: 16px; overflow-y: auto;">
							<div id="propGrid" style=""> 回测报告 </div>

							<div id="userCommand" class="panel panel-default" style="margin-top: 25px; display: none">
								<div class="panel-heading" style="height: 35px;">
									<div style="padding:0px; margin-top:-4px; margin-left:-10px; font-weight:bold">User Command</div>
								</div>
								<div class="panel-body">
									<div>
										<input class="form-control input" placeholder="" id="txtUserCommand" style="width:100%" />
										<input type="submit" value="Send" class="btn btn-default" id="btnSendCommand" style="margin-top: 10px; width:100px" />
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- SOUTH -->

		<div class="ui-layout-south" style="overflow-y: hidden; padding:0px 10px 10px 10px">
			<!-- log pages -->
			<div style="width:100%">

				<!-- tabs -->
				<ul class="nav nav-tabs" role="tablist" id="log-tabs">
					<li role="presentation" class="active">
						<a href="#log-pages-output" aria-controls="log-pages-output" role="tab" data-toggle="tab">输出</a>
					</li>
					<li role="presentation">
						<a href="#log-pages-build" aria-controls="log-pages-build" role="tab" data-toggle="tab">运行日志</a>
					</li>
				</ul>

				<div class="panel panel-default" id="log-pages" style="width: 100%; margin-top: -1px">
					<div class="tab-content">

						<!-- output -->
						<div role="tabpanel" class="tab-pane  active" id="log-pages-output">
							<div class="panel-body" style="height: 100%;">
								<div style="height: 170px">
									<textarea id="txtOutput" style="width: 100%; height: 100%; border-color: #DDDDDD; border-style: solid; border-width: 1px;"></textarea>
								</div>
							</div>
						</div>

						<!-- build log -->
						<div role="tabpanel" class="tab-pane" id="log-pages-build">
							<div class="panel-body" style="height: 100%;">
								<div style="height: 170px">
									<textarea id="txtBuildLog" style="width: 100%; height: 100%; border-color: #DDDDDD; border-style: solid; border-width: 1px;"></textarea>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="panel panel-default" id="status-bar" style="height: 41px; background-color: #f5f5f5; margin-top:-10px">
				<div class="panel-body" style="">

					<div class="" style="float: right; margin-top: -5px; width: auto; text-align: right; margin-left: 15px; margin-right: 0px">
						<p id="lblSimulationDate">01-01-0001 00:00:00</p>
					</div>
					<div class="progress" style="float: right; margin-top: -5px; width: 20%">
						<div id="prgSimulation" class="progress-bar progress-bar-custom" role="progressbar" aria-valuenow="60"
						 aria-valuemin="0" aria-valuemax="100" style="width: 0%">
						</div>
					</div>

					<div class="" style="float: right; margin-top: -5px; width: 150px; text-align: right; margin-right: 17px">
						<p id="lblSimlulation">Simulation</p>
					</div>

					<div class="" style="float: left; margin-top: -5px; width: 450px">
						<p id="lblStatus">状态</p>
					</div>
				</div>
			</div>
		</div>

		<!-- CENTER -->

		<div class="ui-layout-center" style="padding: 0px 0px 0px 0px; overflow-y: hidden">

			<!-- editor , results -->
			<div style="float: left; width: 100%; padding-left: 0px; height: 100%">
				<div style="height: 100%">

					<!-- tabs -->
					<ul class="nav nav-tabs center-tabs" role="tablist" id="centerTabs">

						<li role="presentation" class="active">
							<a href="#home" aria-controls="home" role="tab" data-toggle="tab">首页</a>
						</li>
						<li role="presentation" id="lastStaticTabHeader">
							<a href="#tabReportContent" aria-controls="tabReportContent" role="tab" data-toggle="tab" id="tabReport">策略评估指标</a>
						</li>
						<li role="presentation" id="tabHeaderFills">
							<a href="#fills" aria-controls="fills" role="tab" data-toggle="tab" id="tabFills">交易记录</a>
						</li>
						<!-- <li role="presentation" id="tabHeaderChart">
                        <a href="#hbarChart" aria-controls="hbarChart" role="tab" data-toggle="tab" id="htabBarChart">图表</a>
                    </li> -->


					</ul>

					<!-- pages -->
					<div class="panel panel-default" id="centerPages" style="width: 100%; height: 100%; margin-top: -1px;">
						<div class="tab-content" id="tab-content" style="width: 100%; height: 100%;">
							<!-- home page -->
							<div role="tabpanel" class="tab-pane active" id="home">
								<div class="panel-body">
									<h4>如何开始？</h4>
									<ol>
										<li>新建策略，使用快捷ctrl+s保存</li>
										<li>新运行场景</li>
										<li>切换到代码编辑器，使用快捷alt+r运行当前策略</li>
										<li>底部日志框中可以看到运行状态</li>
										<li>策略运行完成右侧日志栏会有提示</li>
									</ol>

								</div>
							</div>

							<!-- input 
                        <div role="tabpanel" class="tab-pane active" id="input" style="">
                            <div class="panel-body" style="height: 100%;">
55555555555
                            </div>
                        </div>
-->
							<!--
                        <div role="tabpanel" class="tab-pane fullH" id="hbarChart">
                            <div class="panel-body fullH">
                                <div>
                                    <div>
                                        <select class="selectpicker" data-style="cmb-menu" data-width="100%" id="theChart">
                                            <option value="1">逐日收益 </option>
                                            <option value="2">逐笔收益 </option>
                                            <option value="3">逐笔做多收益 </option>
                                            <option value="4">逐笔做空收益 </option>
                                            <option value="5">成交列表 </option>
                                        </select>
                                    </div>

                                </div>
                                <div id="dailyIncome" class="fullH"></div>
                            </div>
                        </div>
-->
							<!-- fills -->
							<div role="tabpanel" class="tab-pane" id="fills" style="height: 100%;overflow-y:scroll">
								<div class="panel-body" style="height: 100%">
									<div class="panel panel-default" style="border-radius: 0px; border-width:1px;">
										<table id="tableT"></table>
										<ul style="float: right;" class="pagination" id="Pager">
											 
										</ul>
									</div>
								</div>
							</div>

							<!-- strategy monitor -->
							<div role="tabpanel" class="tab-pane" id="tabReportContent" style="height: 100%;overflow-y: auto;">
								<div class="panel-body">
									<div id="tbSmmary"></div>
									<div id="accountDetail" class="chartH chartW" style="display: none;">
									</div>
									<div id="dailyIncome" class="chartH chartW" style="display: none;">
									</div>
									<div id="incomeByTran" class="chartH chartW" style="display: none;">
									</div>
									<div id="incomeByLong" class="chartH chartW" style="display: none;">
									</div>
									<div id="incomeByShort" class="chartH chartW" style="display: none;">
									</div>
								</div>

							</div>


						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="modal" id="loginDialog" tabindex="-1" role="dialog" data-dialog-mode="" data-backdrop="static"
		 data-keyboard="false">
			<div class="modal-dialog" role="document">
				<div style="justify-content:center; width:400px; margin:150px auto;">
					<div class="panel panel-default">
						<div class="panel-heading" style="background-color: white; text-align: center">
							<img style="width:200px" src="http://www.syzcfund.com/img/logo.jpg">
						</div>
						<div class="panel-body" style="margin-left: 10px; margin-right: 10px">
							<form action="/Account/Login" class="form-horizontal" method="post" role="form">
								<p style="margin-top: 1px">
									<input class="form-control" data-val="true" data-val-required="请输入用户名." id="UserName" name="UserName"
									 placeholder="用户名" type="text" value="" />
									<span class="field-validation-valid text-danger" data-valmsg-for="用户名" data-valmsg-replace="true"></span>
								</p>
								<p style="margin-top: 15px">
									<input class="form-control" data-val="true" data-val-required="请输入密码." id="Password" name="Password"
									 placeholder="密码" type="password" />
									<span class="field-validation-valid text-danger" data-valmsg-for="密码" data-valmsg-replace="true"></span>
								</p>
								<p style="margin-top: 15px; margin-bottom: 2px;">
									<input id="toLogin" type="button" value="登录" class="btn btn-default" style="width:100%" />
								</p>
							</form>
						</div>


					</div>
				</div>
			</div>
		</div>
		<div class="modal" id="createStrategyDialog" tabindex="-1" role="dialog" data-dialog-mode="">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header" style="background-color:#f6f6f6">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
						<h4 class="modal-title" id="createDialogTitle">新建策略</h4>
					</div>
					<div class="modal-body">
						<div style="margin-bottom:15px" id="createDialogStrategyPanel">
							<div style="margin-bottom: 3px; font-weight: bold;">语言:</div>
							<select class="selectpicker" data-style="cmb-menu" data-width="150px" id="createDialogLanguageCombo">
								<option value="python">Python</option>
							</select>
						</div>

						<div id="createDialogTemplatePanel">
							<div style="margin-bottom: 3px; font-weight: bold;">
								策略模板:
							</div>
							<div class="list-group" id="createDialogOptionList">
								<a href="#" class="list-group-item active">K线驱动型策略</a>
								<a href="#" class="list-group-item">Tick驱动型策略</a>
								<a href="#" class="list-group-item">空项目</a>
							</div>
						</div>

						<div>
							<div style="margin-bottom: 3px; font-weight: bold;" id="createDialogInputLabel">策略名:</div>
							<div style="">
								<input class="form-control input" placeholder="" id="createDialogInputName" style="width: 100%" />
							</div>
						</div>

					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button type="button" class="btn btn-primary" onclick="onCreateDialogOk();">创建</button>
					</div>
				</div>
			</div>
		</div>

		<div class="modal" id="schemaCreateDialog" tabindex="-1" role="dialog" data-dialog-mode="">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header" style="background-color:#f6f6f6">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
						<h4 class="modal-title">新建场景</h4>
					</div>
					<div class="modal-body">
						<div style="margin-bottom: 3px; font-weight: bold;">场景:</div>
						<input class="form-control input" placeholder="场景名" id="schemaName" style="width: 100%" />
						<div style="margin-bottom: 3px; font-weight: bold;">启动资金:</div>
						<input class="form-control input" placeholder="启动资金" id="initFund" value="100000" style="width: 100%" />
						<div style="margin-bottom: 3px; font-weight: bold;">周期:</div>
						<input class="form-control input" placeholder="周期" id="schemaDuration" style="width: 100%" />
						<div style="margin-bottom: 3px; font-weight: bold;">合约:</div>
						<div class="form-group">
							<select id="instrumentOption" class="selectpicker  form-control" multiple data-live-search="true"
							 data-live-search-placeholder="合约符" data-actions-box="true">
								<optgroup label="期货主连" id="options">
								</optgroup>
							</select>
						</div>
						<div class="input-group">
							<label class="input-group-addon">开始时间</label>
							<input type="text" class="form-control" data-datetime-picker="YYYYMMDD" id="datetime-start">
							<span class="input-group-addon">
								<i class="glyphicon glyphicon-calendar"></i>
							</span>
							<span class="input-group-addon">结束时间</span>
							<input type="text" class="form-control" data-datetime-picker="YYYYMMDD" id="datetime-end">
							<span class="input-group-addon">
								<i class="glyphicon glyphicon-calendar"></i>
							</span>
						</div>
						<div style="margin-bottom: 3px; font-weight: bold;">滑点:</div>
						<input class="form-control input" placeholder="滑点" id="slippage" value="0" style="width: 100%" />
						<div style="margin-bottom: 3px; font-weight: bold;">平今手续费:</div>
						<input class="form-control input" placeholder="平今手续费" id="closeTodayFee" value="0.00023" style="width: 100%" />
						<div style="margin-bottom: 3px; font-weight: bold;">平仓手续费:</div>
						<input class="form-control input" placeholder="平仓手续费" id="closeFee" value="0.00023" style="width: 100%" />

					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button id="saveAsSubmitButton" type="button" class="btn btn-primary" onclick="saveSchema();">提交</button>
					</div>
				</div>
			</div>
		</div>

		<div class="modal" id="removeDialog" tabindex="-1" role="dialog" data-dialog-mode="">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header" style="background-color:#f6f6f6">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
						<h4 class="modal-title" id="removeDialogTitle">...</h4>
					</div>
					<div class="modal-body">
						<div id="removeDialogText"></div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
						<button type="button" class="btn btn-primary" onclick="onWorkspaceRemoveDialogOk();">OK</button>
					</div>
				</div>
			</div>
		</div>

		<div class="modal" id="messageBox" tabindex="-1" role="dialog" data-dialog-mode="">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header" style="background-color:#f6f6f6">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
						<h4 class="modal-title" id="messageBoxTitle">QuantWeb</h4>
					</div>
					<div class="modal-body">
						<div id="messageBoxText"></div>
						<div style="visibility: hidden; display:none; height: 0px">
							<textarea id="messageBoxTextToClipboard" style="visibility: visible; height: 110px"></textarea>
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
					</div>
				</div>
			</div>

	</body>

	<script src="static/script/layout.js"></script>

	<script src="static/script/initc.js"></script>

	<script src="static/script/requests.js"></script>
	<script src="static/script/ws.js"></script>
	<script src="static/script/ready.js"></script>
	<!-- 引入 echarts.js -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.1.0/echarts.min.js"></script>
</html>
